<!DOCTYPE html>
<html>
	<head>

    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta name="description" content="">
    <meta name="author" content="">

    <title>SB Admin - Bootstrap Admin Template</title>

    <!-- Bootstrap Core CSS -->
    <link href="__PUBLIC__/home/css/bootstrap.min.css" rel="stylesheet">

    <!-- Custom Fonts -->
    <!--<link href="_PUBLIC__/font/css/font-awesome.min.css" rel="stylesheet" type="text/css">-->

    <!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
    <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
    <!--[if lt IE 9]>
        <script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
        <script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script>
    <![endif]-->
	
</head>
	<body>
		<!--<div class="container-fluid">-->
        <!-- Page Heading -->
	        <div class="row">
				<div class="col-md-12">
					<ol class="breadcrumb">
						<li class="active">
							<i class="fa fa-fw fa-edit"></i>
							添加用户和店铺
						</li>
					</ol>
				</div>
			</div>
			<div class="row">
				<ul class="nav nav-tabs" role="tablist">
				    <li role="presentation" class="active"><a href="#message" aria-controls="home" role="tab" data-toggle="tab">基本信息</a></li>
			 	</ul>
			 	<div class="tab-content col-xs-12">
					<div role="tabpanel" class="tab-pane active" id="message">
						<div class="row">
							<div class="col-sm-10">
								<form id="zyn-form-add" class="form-horizontal" action="{:U('Store/insert')}" method="post">
									<div class="form-group">
										<label for="lc-input-user_name" class="control-label col-sm-2">用户名</label>
										<div class="col-sm-3">
											<input id="lc-input-user_name" class="form-control" type="text" name="user_name" value=""/>
										</div>
										<div class="col-sm-3">
											<p class="lc-p-validate-result p-no-margin" attr-validate = "device_name">*商家登陆账号</p>
										</div>
									</div>
									<div class="form-group">
										<label for="lc-input-password" class="control-label col-sm-2">密码</label>
										<div class="col-sm-3">
											<input id="lc-input-password" class="form-control" type="text" name="password" value=""/>
										</div>
										<div class="col-sm-3">
											<p class="lc-p-validate-result p-no-margin" attr-validate = "url">*商家登陆密码</p>
										</div>
									</div>
									<div class="form-group">
										<label for="lc-input-phone_mob" class="control-label col-sm-2">手机号</label>
										<div class="col-sm-3">
											<input id="lc-input-phone_mob" class="form-control" type="text" name="phone_mob" value=""/>
										</div>
										<div class="col-sm-3">
											<p class="lc-p-validate-result p-no-margin" attr-validate = "phone_mob">*手机号</p>
										</div>
									</div>
									<div class="form-group">
										<label for="lc-input-email" class="control-label col-sm-2">邮箱</label>
										<div class="col-sm-3">
											<input id="lc-input-email" class="form-control" type="text" name="email" value=""/>
										</div>
										<div class="col-sm-3">
											<p class="lc-p-validate-result p-no-margin" attr-validate = "email">*邮箱</p>
										</div>
									</div>
									<div class="form-group">
										<label for="lc-input-store_name" class="control-label col-sm-2">店家名称</label>
										<div class="col-sm-3">
											<input id="lc-input-store_name" class="form-control" type="text" name="store_name" value=""/>
										</div>
										<div class="col-sm-3">
											<p class="lc-p-validate-result p-no-margin" attr-validate = "store_name">*请填写店铺名</p>
										</div>
									</div>
									<div class="form-group">
										<label for="lc-select1-region" class="control-label col-sm-2">地区</label>
										<div class="col-sm-3 form-inline">
											<select class="p-no-margin form-control" value="0" id="lc-select1-region" style="width: auto;">
												<option value="0">请选择</option>
												<volist name="region1" id="re">
													<option value="{$re.region_id}">{$re.region_name}</option>
												</volist>
											</select>
											<select class="p-no-margin form-control" value="0" id="lc-select2-region" style="display: none; width: auto;">
												<option value="0">请选择</option>
											</select>
											<select class="p-no-margin form-control" value="0" id="lc-select3-region" name="region_id" style="display: none; width: auto;">
												<option value="0">请选择</option>
											</select>
											<input style="display: none;" id="lc-input-region_name" name="region_name">
										</div>
										<div class="col-sm-3">
											<p class="lc-p-validate-command p-no-margin" attr-validate = "lc-select1-region">*选择地区</p>
										</div>
									</div>
									<div class="form-group">
										<label for="lc-input-address" class="control-label col-sm-2">地址</label>
										<div class="col-sm-3">
											<input id="lc-input-address" class="form-control" type="text" name="address" value=""/>
										</div>
										<div class="col-sm-3">
											<p class="lc-p-validate-result p-no-margin" attr-validate = "address">*详细地址</p>
										</div>
									</div>
									<div class="col-xs-10 col-xs-offset-2">
										<button class="btn btn-primary" id="lc-btn-save" type="submit">提交保存</button>
										<button class="btn btn-primary" id="lc-btn-return">返回上一页</button>
									</div>
								</form>
							</div>	
						</div>
					</div>
			</div>
		</div>
		
	</body>
	<script src="__PUBLIC__/home/js/jquery.min.js"></script>
    <script src="__PUBLIC__/home/js/bootstrap.min.js"></script>
    <script src=""></script>
	<script>
		var region = '';
		$("#lc-select1-region").on('change',function () {
			if($(this).val()){
                $.ajax({
                    type:"post",
                    url:"{:U('Store/getRegion')}",
                    async:true,
                    data:{'parent_id':$(this).val()},
                    dataType:"json",
                    success:function(result) {
                        if (result.code == 10000) {
                            var shtml = '';
                            for(var i in result.data){
                                shtml += '<option value="'+result.data[i].region_id+'">'+result.data[i].region_name+'</option>'
							}
                            var start = '<option value="0" selected>请选择</option>'
                            $("#lc-select2-region").html(start+shtml)
                            $("#lc-select2-region").css('display','');
                            $("#lc-select3-region").css('display','none');
                            change_region();
                        }
                    }
				});
			}
        })
        $("#lc-select2-region").on('change',function () {
            if($(this).val()){
                $.ajax({
                    type:"post",
                    url:"{:U('Store/getRegion')}",
                    async:true,
                    data:{'parent_id':$(this).val()},
                    dataType:"json",
                    success:function(result) {
                        if (result.code == 10000) {
                            var shtml = '';
                            for(var i in result.data){
                                shtml += '<option value="'+result.data[i].region_id+'">'+result.data[i].region_name+'</option>'
                            }
                            var start = '<option value="0" selected>请选择</option>'
                            $("#lc-select3-region").html(start+shtml)
                            $("#lc-select3-region").css('display','');
                            change_region();
                        }
                    }
                });
            }
        })
        $("#lc-select3-region").on('change',function () {
            change_region();
        });
		function change_region() {
		    region = ''
            console.log($("#lc-select3-region").val())
            if($("#lc-select1-region").val() != 0){
                region += $("#lc-select1-region option:selected").text() + ' ';
            }
            if($("#lc-select2-region").val() != 0){
                region += $("#lc-select2-region option:selected").text() + ' ';
            }
            if($("#lc-select3-region").val() != 0){
                region += $("#lc-select3-region option:selected").text() + ' ';
            }
            $("#lc-input-region_name").val(region);
            console.log($("#lc-input-region_name").val())
        }
        $("#lc-btn-return").click(function () {
			location.href = "{:U('Store/index')}";
        })
    </script>
</html>
